
<script setup lang="ts">
import directive from '../utils/directive.ts'; // 引入自定义指令
const vReverse = directive.reverseDirective
</script>

<template>
    <div class="relative py-32 px-16 bg-white h-screen overflow-hidden">
        <div class="h-full flex items-center justify-center">
            <img class="absolute py-32 px-16 h-full" src="../../../assets//sqm/one-1.jpg" alt="">
            <div class="absolute py-32 px-16 flex h-full">
                <div class="flex-1"></div>
                <div class="flex-1 flex flex-col justify-evenly items-center">
                    <span class="text-white">
                        You can enjoy different tastes and textures of Japanese wagyu depending on its cuts.
                        What brings these differences is “marbling” which is the greatest feature of Japanese wagyu.
                        Which Japanese wagyu cut is your favorite?
                        Let’s explore the unseen world of Japanese wagyu.
                    </span>
                    <div class="bg-white rounded-full px-12 py-2">Find Out More</div>
                </div>
            </div>
            <div class="absolute py-32 px-16 -top-8">
                <div v-reverse class="h-7 text-2xl text-center">Let’s explore the unseen world of</div>
                <div v-reverse class="h-16 text-6xl text-center">Japanese wagyu.</div>
            </div>
        </div>
    </div>
</template>

<style scoped>
</style>
